//$(function() {}) 是$(document).ready(function()的简写, 这个函数什么时候执行的呢？DOM 加载完毕之后执行。
$(function () {
    $("#jqGrid").jqGrid({
        url: baseURL + 'cs/zbsjdemo/list',
        datatype: "json",
        // colModel:Array类型。
        // 常用到的属性：name 列显示的名称；index 传到服务器端用来排序用的列名称；
        // width 列宽度；align 对齐方式；sortable 是否可以排序
        colModel: [			
			{ label: 'zbsjId', name: 'zbsjId', index: 'zbsj_id', width: 50, key: true },
			{ label: '一级指标', name: 'oneZb', index: 'one_zb', width: 80 }, 			
			{ label: '二级指标', name: 'secZb', index: 'sec_zb', width: 80 }, 			
			{ label: '指标名称', name: 'zbName', index: 'zb_name', width: 80 }, 			
			{ label: '解释', name: 'js', index: 'js', width: 80 },
			{ label: '指标层级', name: 'zbLevel', index: 'zb_level', width: 80 }, 			
			{ label: '填写单位', name: 'filloutUnit', index: 'fillout_unit', width: 80 },
			{ label: '结果', name: 'zg', index: 'zg', width: 80 }, 			
			{ label: '国家标准', name: 'nationalStandards', index: 'national_standards', width: 80 }, 			
			{ label: '计算依据', name: 'calcuBasis', index: 'calcu_basis', width: 80 }, 			
			{ label: '创建时间', name: 'createTime', index: 'create_time', width: 80 }, 			
			{ label: '原始数据文件', name: 'oriDataFile', index: 'ori_data_file', width: 80 }			
        ],
		viewrecords: true, //定义是否要显示总记录数
        height: 385, //表格高度，可以是数字，像素值或者百分比
        rowNum: 10, // 在grid上显示记录条数，这个参数是要被传递到后台
		rowList : [10,30,50], //一个下拉选择框，用来改变显示记录数，当选择时会覆盖rowNum参数传递到后台
        rownumbers: true,  //如果为ture则会在表格左边新增一列，显示行顺序号，从1开始递增。此列名为'rn'.
        rownumWidth: 25,  // 如果rownumbers为true，则可以设置column的宽度
        autowidth:true,
        multiselect: true,
        pager: "#jqGridPager",
        // 描述json 数据格式的数组
        jsonReader : {
            root: "page.list",
            page: "page.currPage",
            total: "page.totalPage",
            records: "page.totalCount"
        },
        //Default valuesprmNames:
        // {page:“page”,rows:“rows”, sort: “sidx”,order: “sord”, search:“_search”, nd:“nd”, npage:null}
        // 当参数为null时不会被发到服务器端
        prmNames : {
            page:"page", 
            rows:"limit", 
            order: "order"
        },
        // 当表格所有数据都加载完成而且其他的处理也都完成时触发此事件，排序，翻页同样也会触发此事件
        gridComplete:function(){
        	//隐藏grid底部滚动条
        	$("#jqGrid").closest(".ui-jqgrid-bdiv").css({ "overflow-x" : "hidden" }); 
        }
    });
});

var vm = new Vue({
	el:'#rrapp',//实例化
	data:{
		showList: true,//<div v-show="showList"> 显示隐藏
		title: null,//<div class="panel-heading">{{title}}</div> 绑定值
		zbsjdemo: {}
	},
	methods: {
		query: function () {
			vm.reload();
		},
        // <a class="btn btn-primary" @click="add"><i class="fa fa-plus"></i>&nbsp;新增</a> 绑定add函数
		add: function(){
			vm.showList = false;
			vm.title = "新增";
			vm.zbsjdemo = {};
		},
		update: function (event) {
		    // getSelectedRow()位于common.js中 返回值为选中的行
			var zbsjId = getSelectedRow();
			if(zbsjId == null){
				return ;
			}
			vm.showList = false;
            vm.title = "修改";
            // geiInfo为vue定义的函数，传入参数为
            vm.getInfo(zbsjId)
		},

        // id为btnSaveOrUpdate的元素绑定saveOrUpdate方法
		saveOrUpdate: function (event) {
		    //button元素有data-loading-text属性，其属性值为加载时显示的内容
            // button('loading') 给按钮添加加载状态 delay(1000)表示延迟1000进入队列
		    $('#btnSaveOrUpdate').button('loading').delay(1000).queue(function() {
		        // 如果zbsjId为null，则新增，否则为更新 确定请求的url
                var url = vm.zbsjdemo.zbsjId == null ? "cs/zbsjdemo/save" : "cs/zbsjdemo/update";

                $.ajax({
                    type: "POST",
                    url: baseURL + url,
                    contentType: "application/json",
                    data: JSON.stringify(vm.zbsjdemo),
                    success: function(r){
                        if(r.code === 0){
                             layer.msg("操作成功", {icon: 1});

                             vm.reload();
                             $('#btnSaveOrUpdate').button('reset');
                             $('#btnSaveOrUpdate').dequeue();
                        }else{
                            layer.alert(r.msg);
                            $('#btnSaveOrUpdate').button('reset');
                            $('#btnSaveOrUpdate').dequeue();
                        }
                    }
                });
			});
		},
		del: function (event) {
			var zbsjIds = getSelectedRows();
			if(zbsjIds == null){
				return ;
			}
			var lock = false;
            layer.confirm('确定要删除选中的记录？', {
                btn: ['确定','取消'] //按钮
            }, function(){
               if(!lock) {
                    lock = true;
		            $.ajax({
                        type: "POST",
                        url: baseURL + "cs/zbsjdemo/delete",
                        contentType: "application/json",
                        data: JSON.stringify(zbsjIds),
                        success: function(r){
                            if(r.code == 0){
                                layer.msg("操作成功", {icon: 1});
                                // trigger为jqGrid对象函数： 重新加载当前表格，也会向服务器发起新的请求
                                $("#jqGrid").trigger("reloadGrid");
                            }else{
                                layer.alert(r.msg);
                            }
                        }
				    });
			    }
             }, function(){
             });
		},
		getInfo: function(zbsjId){
		    // 传入指标数据主键ID，返回对应整行数据r
			$.get(baseURL + "cs/zbsjdemo/info/"+zbsjId, function(r){
			    // 将整行数据赋值给vm.zbsjdemo，绑定在#rrapp元素上
                vm.zbsjdemo = r.zbsjdemo;
            });
		},
		reload: function (event) {
			vm.showList = true;
			//返回请求的参数信息
			var page = $("#jqGrid").jqGrid('getGridParam','page');
			$("#jqGrid").jqGrid('setGridParam',{ 
                page:page
            }).trigger("reloadGrid");
		}
	}
});